---
import { contentfulClient } from "#/lib/contentful/client.ts"
import type { LandingPageFields, LandingPageSkeleton } from "#/lib/contentful/types.ts"

import ContainedSection from "#/components//ContainedSection.astro"
import ConsensusSection from "#/components/sections/landing/ConsensusSection.astro"
import ExecutionSection from "#/components/sections/landing/ExecutionSection.astro"
import ZkSection from "#/components/sections/landing/ZkSection.astro"
import MarqueeSection from "#/components/sections/MarqueeSection.astro"
import SectionsContainer from "#/components/SectionsContainer.astro"

import pod_atom from "#/assets/images/marquee/pods/atom.png"
import pod_blockchange from "#/assets/images/marquee/pods/blockchange.png"
import pod_borderless from "#/assets/images/marquee/pods/borderless.png"
import pod_consensys from "#/assets/images/marquee/pods/consensys.png"
import pod_galileo from "#/assets/images/marquee/pods/galileo.png"
import pod_gumi from "#/assets/images/marquee/pods/gumi.png"
import pod_lightshift from "#/assets/images/marquee/pods/lightshift.png"
import pod_longhash from "#/assets/images/marquee/pods/longhash.png"
import pod_polygon from "#/assets/images/marquee/pods/polygon.png"
import pod_semantic from "#/assets/images/marquee/pods/semantic.png"
import pod_tioga from "#/assets/images/marquee/pods/tioga.png"

import partner_arbitrum from "#/assets/images/marquee/partners/arbitrum.png"
import partner_bera from "#/assets/images/marquee/partners/bera.png"
import partner_movement from "#/assets/images/marquee/partners/movement.png"
import partner_polygon from "#/assets/images/marquee/partners/polygon.png"
import partner_scroll from "#/assets/images/marquee/partners/scroll.png"
import partner_secret from "#/assets/images/marquee/partners/secret.png"
import partner_stargaze from "#/assets/images/marquee/partners/stargaze.png"
import partner_stride from "#/assets/images/marquee/partners/stride.png"
import AnimationLayout from "#/layouts/AnimationLayout.astro"

export const prerender = false

// The browser should always check freshness
Astro.response.headers.set("cache-control", "public, max-age=0, must-revalidate")

const pods = [
  { name: "Tioga", logo: pod_tioga, url: "" },
  { name: "Semantic", logo: pod_semantic, url: "" },
  { name: "Polygon", logo: pod_polygon, url: "" },
  { name: "Longhash", logo: pod_longhash, url: "" },
  { name: "Lightshift", logo: pod_lightshift, url: "" },
  { name: "Gumi", logo: pod_gumi, url: "" },
  { name: "Galileo", logo: pod_galileo, url: "" },
  { name: "Consensys", logo: pod_consensys, url: "" },
  { name: "Borderless", logo: pod_borderless, url: "" },
  { name: "Blockchange", logo: pod_blockchange, url: "" },
  { name: "Atom", logo: pod_atom, url: "" },
]

const partners = [
  { name: "Stride", logo: partner_stride, url: "" },
  { name: "Stargaze", logo: partner_stargaze, url: "" },
  { name: "Secret", logo: partner_secret, url: "" },
  { name: "Scroll", logo: partner_scroll, url: "" },
  { name: "Polygon", logo: partner_polygon, url: "" },
  { name: "Movement", logo: partner_movement, url: "" },
  { name: "Bera", logo: partner_bera, url: "" },
  { name: "Arbitrum", logo: partner_arbitrum, url: "" },
]

let landingData: LandingPageFields | null = null
let error: string | null = null
try {
  const landingEntries = await contentfulClient.getEntries<LandingPageSkeleton>({
    content_type: "landing",
  })
  if (landingEntries.items.length > 0) {
    landingData = landingEntries.items[0].fields
  } else {
    error = "No landing page data found."
  }
} catch (err) {
  console.error("Error fetching Contentful data:", err)
  error = "Failed to load content. Please try again later."
}
---

{
  error ? (
    <div class="error-message">
      <h2>Error</h2>
      <p>{error}</p>
    </div>
  ) : landingData ? (
    <AnimationLayout
      title="Join the union"
      text="The next generation of aggregation, interoperability, and chain abstraction."
    >
      <SectionsContainer>
        <ConsensusSection
          title={landingData.secondTitle}
          text={landingData.secondText}
        />
        <ZkSection
          title={landingData.thirdTitle}
          text={landingData.thirdText}
        />
        <ExecutionSection
          title={landingData.fourthTitle}
          text={landingData.fourthText}
        />
        <ContainedSection>
          <div class="py-16">
            <MarqueeSection
              title={"Our partners."}
              reverse={true}
              data={partners}
            />
          </div>
        </ContainedSection>
      </SectionsContainer>
    </AnimationLayout>
  ) : (
    <div class="loading-message">
      <p>Loading content...</p>
    </div>
  )
}
